<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0,
                maximum-scale=1.0, minimum-scale=1.0,user-scalable=no">
    <title>携程网</title>
    <link rel="stylesheet" href="normalize.css">
    <link rel="stylesheet" href="index.css">
    <link rel="stylesheet" href="https://cdn.staticfile.org/font-awesome/4.7.0/css/font-awesome.css">
    <script type="text/javascript" src="index.js"></script>
</head>

<body>
    <!-- 搜索框 -->
    <div class="search-index">
        <div class="search">
            <i class="fa fa-search" aria-hidden="true" style="line-height: 28px;margin:0 8px;color: #2eaae0;"></i>搜索:目的地/酒店/景点/航班号
        </div>
        <div class="user">
            <i class="fa fa-user-circle" aria-hidden="true" style="width: 44px;font-size: 22px;margin-top: 3px;"></i>
            <a href="#">我的</a>
        </div>
    </div>
    <!-- 焦点图 -->
    <div class="focus">
        <ul>
            <li><img src="images/focus3.jpg"></li>
            <li><img src="images/focus.jpg"></li>
            <li><img src="images/focus2.jpg"></li>
            <li><img src="images/focus3.jpg"></li>
            <li><img src="images/focus.jpg"></li>
        </ul>
        <!-- 圆点 -->
        <ol>
            <li class="active"></li>
            <li></li>
            <li></li>
        </ol>
    </div>
    <!-- 导航栏 -->
    <ul class="local-nav">
        <li>
            <a href="#" title="攻略·景点">
                <span class="local-nav-icon-icon1"></span>
                <span>攻略·景点</span>
            </a>
        </li>
        <li>
            <a href="#" title="门票·玩乐">
                <span class="local-nav-icon-icon2"></span>
                <span>门票·玩乐</span>
            </a>
        </li>
        <li>
            <a href="#" title="美食林">
                <span class="local-nav-icon-icon3"></span>
                <span>美食林</span>
            </a>
        </li>
        <li>
            <a href="#" title="周边游">
                <span class="local-nav-icon-icon4"></span>
                <span>周边游</span>
            </a>
        </li>
        <li>
            <a href="#" title="一日游">
                <span class="local-nav-icon-icon5"></span>
                <span>一日游</span>
            </a>
        </li>
    </ul>
    <!-- 主导航栏 -->
    <nav>
        <div class="nav-common">
            <div class="nav-items"><a href="#" title="酒店">酒店</a></div>
            <div class="nav-items"><a href="#" title="民宿·客栈">民宿·客栈</a></div>
            <div class="nav-items"><a href="#" title="特价·爆款">特价·爆款</a></div>
        </div>
        <div class="nav-common">
            <div class="nav-items"><a href="#" title="酒店">酒店</a></div>
            <div class="nav-items"><a href="#" title="酒店">酒店</a></div>
            <div class="nav-items-3"><a href="#" title="酒店">酒店</a></div>
            <div class="nav-items-4"><a href="#" title="酒店">酒店</a></div>
        </div>
        <div class="nav-common">
            <div class="nav-items"><a href="#" title="酒店">酒店</a></div>
            <div class="nav-items"><a href="#" title="酒店">酒店</a></div>
            <div class="nav-items-3"><a href="#" title="酒店">酒店</a></div>
            <div class="nav-items-4"><a href="#" title="酒店">酒店</a></div>
        </div>
    </nav>
    <!-- 侧导航栏 -->
    <ul class="subnav-entry">
        <li>
            <a href="#" title="自由行">
                <span class="subnav-entry-icon"></span>
                <span>自由行</span>
            </a>
        </li>
        <li>
            <a href="#" title="自由行">
                <span class="subnav-entry-icon"></span>
                <span>自由行</span>
            </a>
        </li>
        <li>
            <a href="#" title="自由行">
                <span class="subnav-entry-icon"></span>
                <span>自由行</span>
            </a>
        </li>
        <li>
            <a href="#" title="自由行">
                <span class="subnav-entry-icon"></span>
                <span>自由行</span>
            </a>
        </li>
        <li>
            <a href="#" title="自由行">
                <span class="subnav-entry-icon"></span>
                <span>自由行</span>
            </a>
        </li>
        <li>
            <a href="#" title="自由行">
                <span class="subnav-entry-icon"></span>
                <span>自由行</span>
            </a>
        </li>
        <li>
            <a href="#" title="自由行">
                <span class="subnav-entry-icon"></span>
                <span>自由行</span>
            </a>
        </li>
        <li>
            <a href="#" title="自由行">
                <span class="subnav-entry-icon"></span>
                <span>自由行</span>
            </a>
        </li>
        <li>
            <a href="#" title="自由行">
                <span class="subnav-entry-icon"></span>
                <span>自由行</span>
            </a>
        </li>
        <li>
            <a href="#" title="自由行">
                <span class="subnav-entry-icon"></span>
                <span>自由行</span>
            </a>
        </li>
    </ul>
    <!-- 广告 -->
    <div class="sales-box">
        <div class="sales-hd">
            <h2>热门活动</h2>
            <img src="images/icon-gg.png" style="width: 36px;height: 15px;left:105px;top:15px;position: absolute;">
            <a href="#" class="more">获取更多福利></a>
        </div>
    </div>
    <div class="gg">
        <img src="images/gg.jpg">
    </div>
    <!-- 底部 -->
    <ul class="footer">
        <li>
            <a href="#">
                <i class="fa fa-phone" aria-hidden="true" style="font-size: 18px;"></i>
                <span>电话预订</span>
            </a>

        </li>
        <li>
            <a href="#">
                <i class="fa fa-download" aria-hidden="true" style="font-size: 18px;"></i>
                <span>下载客户端</span>
            </a>
        </li>
        <li>
            <a href="#">
                <i class="fa fa-user-circle" aria-hidden="true" style="font-size: 18px;"></i>
                <span>我的</span>
            </a>
        </li>
    </ul>
    <div class="font">
        <a href="#">网站地图</a>
        <a href="#">｜Language｜</a>
        <a href="#">电脑版</a>
        <p>©2020携程旅行｜沪ICP备08023580号</p>
    </div>
</body>

</html>